<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>商品分类--${site.name}</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <meta name="description" content="${site.description}"/>
    <meta name="keywords" content="${site.keywords}"/>
    <meta name="author" content="${site.author}"/>
    <link rel="icon" href="${site.logo}">
    <link rel="stylesheet" href="${base}/static/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="${base}/static/css/user.css" media="all" />
</head>
<body class="childrenBody">
    <!--<form class="layui-form" id="searchForm">
    <div class="layui-inline" style="margin-left: 15px">
            <label>分类名称:</label>
                <div class="layui-input-inline" style="margin-left: 15px">
                <input type="text" value="" name="s_name" placeholder="请输入分类名称" class="layui-input search_input">
                </div>
    </div>
    <div class="layui-inline" style="margin-left: 15px">
            <label>分类级别:</label>
                <div class="layui-input-inline" style="margin-left: 15px">
                <select name="s_level">
                    <option value="" selected="">请选择分类级别</option>
                    <@my type="mall_p_cata_level">
                    <#list result as r>
                    <option value="${r.value}" >${r.label}</option>
                    </#list>
                    </@my>
                </select>
                </div>
    </div>
		<div class="layui-inline" style="margin-left: 15px">
            <label>状态:</label>
            <div class="layui-input-inline">
            <select name="s_delFlag">
                <option value="" selected="">请选择</option>
                 <option value="false" >启用</option>
                <option value="true" >禁用</option>
            </select>
            </div>
   		</div>
        <div class="layui-inline">
            <a class="layui-btn" lay-submit="" lay-filter="searchForm">查询</a>
        </div>
    </form>-->
<div class="layui-form users_list">
    <table class="layui-table" id="test" lay-filter="demo"></table>
    <script type="text/html" id="icon">
    {{#  if(d.icon != "" && d.icon != null){ }}
    <span id="icon_{{d.id}}" ><img lay-event="imageicon" layer-pid="{{d.id}}" layer-src="{{d.icon}}" src="{{d.icon}}" style="width: 40px;"/></span>
    {{#  } else { }}
    <span ></span>
    {{#  } }}
    </script>
    <script type="text/html" id="level">
        <@my type="mall_p_cata_level">
        <#list result as r>
        {{#  if(d.level == '${r.value}'){ }}
        <span>${r.label}</span>
        {{#  } }}
        </#list>
        </@my>
    </script>
    <script type="text/html" id="userStatus">
        <input type="checkbox" data-id="{{d.id}}" lay-filter="delFlag" lay-skin="switch"    lay-text="正常|禁用" {{#  if(d.delFlag == false){ }} checked {{#  } }}>
    </script>
    
    <script type="text/html" id="toolbarDemo">
	  <div class="layui-btn-container">
	    <button class="layui-btn layui-btn-sm" lay-event="addMallPCata"><i class="layui-icon">&#xe624;</i>添加</button>
	    <!--<button class="layui-btn layui-btn-sm" lay-event="batchDel"><i class="layui-icon">&#xe640;</i>批量删除</button>-->
	  </div>
	</script>

    <script type="text/html" id="barDemo">
    	 <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="add"><i class="layui-icon">&#xe624;</i>添加二级分类</a>
        <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</a>
         <!--<a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="detail"><i class="layui-icon">&#xe702;</i>详情</a>
       <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="del"><i class="layui-icon">&#xe640;</i>删除</a>-->
    </script>
    
    <script type="text/html" id="barDemoChild">
        <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="editChild"><i class="layui-icon">&#xe642;</i>编辑</a>
    </script>
</div>
<div id="page"></div>
<script type="text/javascript" src="${base}/static/layui/layui.js"></script>
<script type="text/javascript" src="${base}/static/js/tools.js"></script>
<script>
	var opTable;
    layui.config({
			base : "${base}/static/layui/lay/mymodules/"
		}).use(['layer','form','table','laydate','opTable'], function() {
        var layer = layui.layer,
        $ = layui.jquery,
        form = layui.form,
        laydate = layui.laydate,
        table = layui.table;

		 //监听二级表工具条
        table.on('tool(child)', function(obj){
           var data = obj.data;
        	if(obj.event === 'editChild'){
                var editIndex = layer.open({
                    title : "编辑",
                    type : 2,
                    shade: 0.3,
                    shadeClose: true,
					closeBtn: 0,
					anim: 3,
					resize:false,
					isOutAnim: false,
					offset: 'r',
                    area:['50%','100%'],
                    content : "${base}${adminPrefix}/mall-pcata/edit?id="+data.id,
                    success : function(layero, index){
                    }
                });
            } else if(obj.event == "imageicon"){
                layer.photos({
                    photos: '#icon_'+data.id,
                    anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
                });
            }
        });

        //监听工具条
        table.on('tool(demo)', function(obj){
            var data = obj.data;
            if(obj.event === 'add'){
                var editIndex = layer.open({
                    title : '添加二级分类',
                    type : 2,
                    shade: 0.3,
                    shadeClose: true,
					closeBtn: 0,
					anim: 3,
					resize:false,
					isOutAnim: false,
					offset: 'r',
                    area:['50%','100%'],
                    content : "${base}${adminPrefix}/mall-pcata/add?level=2&refcataid="+data.id
                });
            } else if(obj.event === 'detail'){
                var editIndex = layer.open({
                    title : '查看',
                    type : 2,
                    shade: 0.3,
                    shadeClose: true,
					closeBtn: 0,
					anim: 3,
					resize:false,
					isOutAnim: false,
					offset: 'r',
                    area:['50%','100%'],
                    content : "${base}${adminPrefix}/mall-pcata/detail?id="+data.id
                });
            } else if(obj.event === 'edit'){
                var editIndex = layer.open({
                    title : "编辑",
                    type : 2,
                    shade: 0.3,
                    shadeClose: true,
					closeBtn: 0,
					anim: 3,
					resize:false,
					isOutAnim: false,
					offset: 'r',
                    area:['50%','100%'],
                    content : "${base}${adminPrefix}/mall-pcata/edit?id="+data.id,
                    success : function(layero, index){
                    }
                });
            }
            if(obj.event === "del"){
                layer.confirm("你确定要删除该商品分类么？",{btn:['是的,我确定','我再想想']},
                        function(){
                            $.post("${base}${adminPrefix}/mall-pcata/delete",{"id":data.id},function (res){
                                if(res.success){
                                    layer.msg("删除成功",{time: 1000},function(){
                                        opTable.config.table.reload();
                                    });
                                }else{
                                    layer.msg(res.message);
                                }

                            });
                        }
                )
            }
            if(obj.event == "imageicon"){
                layer.photos({
                    photos: '#icon_'+data.id,
                    anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
                });
            }
        });

        var t = {
            elem: '#test',
            id: '#test',
            url:'${base}${adminPrefix}/mall-pcata/list',
            method:'post',
            where: {level:1},
            toolbar: '#toolbarDemo', //开启头部工具栏，并为其绑定左侧模板
            defaultToolbar: [],//['filter', 'exports', 'print'], //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
            page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'], //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                groups: 2, //只显示 1 个连续页码
                first: "首页", //显示首页
                last: "尾页", //显示尾页
                limits:[3,10, 20, 30]
            },
            cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            cols: [[
                {field:'name', title: '分类名称'},
                {field:'icon', title: '分类图标',templet:'#icon'},
                {field:'level', title: '分类级别'},
                {field:'delFlag',    title: '状态',templet:'#userStatus'},
                {fixed: 'right', title:'操作',   align: 'center',toolbar: '#barDemo'}
            ]],openTable: function (itemData) {
		        return {
		          elem: '#child'
		          , id: 'child'
		          , url: '${base}${adminPrefix}/mall-pcata/list'
		          , method:'post'
		          , where: {parentid: itemData.id,level:2}
		          , cols: [[
		             {field:'name', title: '分类名称'},
	                {field:'icon', title: '分类图标',templet:'#icon'},
	                {field:'level', title: '分类级别'},
	                {field:'delFlag',    title: '状态',templet:'#userStatus'},
	                {fixed: 'right', title:'操作',   align: 'center',templet: '#barDemoChild'}
		          ]]
		        }
		      }
        };
        opTable = layui.opTable.render(t);
        
        //头工具栏事件
		  table.on('toolbar(demo)', function(obj){
		    var checkStatus = table.checkStatus(obj.config.id);
		    switch(obj.event){
		      case 'addMallPCata':
		       var addIndex = layer.open({
                    title : "添加",
                    type : 2,
                    shade: 0.3,
                    shadeClose: true,
					closeBtn: 0,
					anim: 3,
					resize:false,
					isOutAnim: false,
					offset: 'r',
                    area:['50%','100%'],
                    content : "${base}${adminPrefix}/mall-pcata/add?level=1",
                    success : function(layero, addIndex){
                    }
                });
		      	break;
		       case 'batchDel':
		       	 console.log(checkStatus.data);
		         var ids = [];
		         for(var index=0;index<checkStatus.data.length;index++){
		         	ids.push(checkStatus.data[index].id);
		         }
		         if(ids.length==0){
		         	layer.msg('请至少选择一项');
		         	return;
		         }
		         layer.confirm("你确定要删除选中的内容么？",{btn:['是的,我确定','我再想想']},
                        function(){
                         $.post("${base}${adminPrefix}/mall-pcata/batchDel",{"ids":ids},function (res){
				                if(res.success){
				                    layer.msg("删除成功",{time: 1000},function(){
                                       opTable.config.table.reload();
                                    });
				                }else{
				                    layer.msg(res.message);
				                }
				            });
                        }
                 )
		         break;
		    };
		  });

        form.on("submit(searchForm)",function(data){
            t.where = data.field;
             opTable.config.table.reload(t);
            return false;
        });
        
        form.on('switch(delFlag)', function(data){
			   $.post("${base}${adminPrefix}/mall-pcata/change-status",{"id":data.elem.dataset.id,"status":!data.elem.checked},function (res){
	                if(res.success){
	                }else{
	                    layer.msg(res.message);
	                }
	
	            });
        });

    });
</script>
</body>
</html>